<template>
    <!-- 1.父组件传递信息给子组件 -->
    <!-- <StudentInfo :id="id" :name="name" :age="age" :gender="gender"></StudentInfo> -->
    <!-- 2.父组件传递信息给子组件 -->
    <!-- <AppSon :students="objs"></AppSon> -->
    <!-- <AppSon :students="objs" title="this is test"></AppSon> -->
    <!-- 3.子组件传递信息给父组件 -->
    <span v-for="student in students" :key="student">
        {{ student }}-
    </span>
    <AppSon1 @addStudent="parentMethod"></AppSon1>
</template>

<script>
// 3.子组件传递信息给父组件
import AppSon1 from './components/AppSon1.vue';
export default {
    components: {
        AppSon1
    },
    data() {
        return {
            students: [],
        }
    },
    methods: {
        // 自定义addStudent触发后，会调用对应的parentMethod方法
        parentMethod(name) {
            console.log('into app.vue parentMethod');
            this.students.push(name);
        }
    },
}
/* 2.父组件传递信息给子组件*/
// import AppSon from './components/AppSon.vue';

// export default {
//     components: {
//         AppSon,
//     },
//     data() {
//         return {
//             objs: [
//                 { id: 1, name: '张三', age: 22, gender: '男' },
//                 { id: 2, name: '李四', age: 29, gender: '女' },
//                 { id: 3, name: '王二', age: 32, gender: '男' }
//             ]
//         }
//     },
// }

// // 1.父组件传递信息给子组件
// import StudentInfo from './components/StudentInfo.vue'
// export default {
//     components: {
//         StudentInfo,
//     },
//     data() {
//         return {
//             id: 1,
//             name: '小明',
//             age: 22,
//             gender: '男'
//         }
//     },
// }

</script>